const xspeed = 1;

var g_winReq, g_canvas, g_context, g_line, g_line2;

function changeLine()
{
    g_line.x += xspeed / 2;
    g_line2.x += xspeed;
}

function drawFrame()
{
    g_winReq( drawFrame, g_canvas );
    g_context.clearRect( 0, 0, g_canvas.width, g_canvas.height );
    changeLine();
    g_line.draw( g_context );
    g_line2.draw( g_context );
}


function onloadHandler()
{
    g_canvas = document.getElementById( 'canvas' );
    g_context = g_canvas.getContext( '2d' );
    g_winReq = winRequestAnimFrame();

    g_line = new Line( 0, 100, 3, "#007fff", "#386ca1" );
    g_line2 = new Line( 0, 300, 10, "#e61f1f", "#1f74e6" );
  
    drawFrame(); 
}

window.onload = onloadHandler;    